<script setup lang="ts">
import { ref } from "vue";
import { ElCard, ElLink } from "element-plus";
import DialogUploadPass from "./components/DialogUploadPass.vue";

import setting from "@/utils/setting";
import useApp from "@/store/useApp";

const visible = ref(false);

const stateApp = useApp();
</script>

<template>
  <ElCard class="flex-auto">
    <div class="bg-[gray]/5 p-12 rounded-lg">
      <div class="flex">
        <div class="w-[100px]">供应商</div>
        <div>{{ stateApp.userInfo?.brand }}</div>
      </div>

      <div class="flex my-12">
        <div class="w-[100px]">手机号</div>
        <div>{{ stateApp.userInfo?.name }}</div>
      </div>

      <div class="flex">
        <div class="w-[100px]">密码</div>
        <ElLink type="primary" @click="visible = true">修改密码</ElLink>
      </div>
    </div>

    <div class="my-6">
      忘记密码联系管理员：{{ setting.platformServiceHotline }}
    </div>
  </ElCard>

  <DialogUploadPass v-model="visible" />
</template>
